Blog Design Computer IT Help 86 | Best Urdu & Hindi Tutorials

How to Remove Blogger Images Shadows and Borders

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjP8bvzAvNdr_UA3YOaMNnFecbJVytr811UE5CPNWHkGTHPViflv-BsFvJRfArIQeGjibG0IYyxpuJDpwUlLqmkJ7Hu7VH9vrXW8RbW2LzInC0yWssmPPTkP-YQUQmi0Rfa6tsjafj6_r0/s1600/How+to+remove+blogger+images+shadows+and+borders.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="How to Remove Blogger Images Shadows and Borders" border="0" height="222" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjP8bvzAvNdr_UA3YOaMNnFecbJVytr811UE5CPNWHkGTHPViflv-BsFvJRfArIQeGjibG0IYyxpuJDpwUlLqmkJ7Hu7VH9vrXW8RbW2LzInC0yWssmPPTkP-YQUQmi0Rfa6tsjafj6_r0/s400/How+to+remove+blogger+images+shadows+and+borders.png" title="How to Remove Blogger Images Shadows and Borders" width="400" /></a></div>In your Daily Basic routine of blogging ,you have might a maximum number of images into your blogger.For example you have posted on a Celebrity and there you have uploaded a number of Images.So there you have also seen Shadow and Border around that images that you have uploaded.Sometimes you don't like this and wanted to remove those Shadows and Borders but you have failed every time because of No Knowledge and No Guide about removing them. <a name="more"></a> So in this tutorial You will Learn How you can Remove Shadows and Border from Blogger Images/Pictures.Follow these instruction and easily remove Shadows and Borders from Blogger images/Pictures. <h3>How to Remove Blogger Images/Pictures Shadow and Border</h3>Step 1:Go to your Blogger Dashboard ,then click on "Template" and Hit on "Customize" button. Step 2:Once you will click on "Customize" , then a new window will open.From there Click on "Advanced" . then again click on "ADD CSS" . now there Copy and Paste this below code. Code: <blockquote class="tr_bq">.post-body img, .post-body .tr-caption-container, .Profile img, .Image img, .BlogList .item-thumbnail img {   padding: 0 !important;   border: none !important;   background: none !important;   -moz-box-shadow: 0px 0px 0px transparent !important;   -webkit-box-shadow: 0px 0px 0px transparent !important;   box-shadow: 0px 0px 0px transparent !important; }</blockquote>As you can show in this Screenshot. <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYN3ZaPpRazb4H1WM6AXc4DxntwI5raJvIfc7TrKFzF1StzkTdc8sz8X4oXGbrDpBrMwLQ1DcjgKoaTgaKmoT9eLDvCEzPGUNe5OTfnFvA8Toh4LeElkOHpAZ-7AiOIyOjNI2gC-Tx3bq7/s1600/remove+hide+shadow+border+on+blogger+pictures+images.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Remove Blogger Images Shadow and Border" border="0" height="198" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYN3ZaPpRazb4H1WM6AXc4DxntwI5raJvIfc7TrKFzF1StzkTdc8sz8X4oXGbrDpBrMwLQ1DcjgKoaTgaKmoT9eLDvCEzPGUNe5OTfnFvA8Toh4LeElkOHpAZ-7AiOIyOjNI2gC-Tx3bq7/s640/remove+hide+shadow+border+on+blogger+pictures+images.png" title="How to Remove Blogger Images Shadow and Border" width="640" /></a></div> After Adding the code into CSS input field, then Click on "Apply to Blog" for applying these codes.Now open your Blog and there you can see blogger images appeared without any shadow or any border. NOTE:If This Method Doesn't work into your Blog Then Follow this new Method: Step 1:Go to you Blogger , Then click on "Template" and Select "Edit HTML". Step 2:Now Press (CTRL+F) from your keyboard for opening the Search Box. Then paste this Code and Find it in your Blogger template. <blockquote class="tr_bq">border: 1px solid $(image.border.color);   -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);   -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);   box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);</blockquote>Step 3:When you will find these code into your Blog , Now delete them from your Blogger Template. If you can't find this code any where inside your Blogger template , then try to search for this Code in to your Blogger Template. <blockquote class="tr_bq">-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1); </blockquote>Once you will find this above code into your Blogger template  ,Simply delete it and Save the Template.After Saving the Template you will not Find any Shadow or Border around your Blogger images/pictures.

How to Remove Blogger Images Shadows and Borders

In your Daily Basic routine of blogging ,you have might a maximum number of images into your blogger.For example you have posted on a Celebr...

How to Add Numbered Comments in Blogger

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo493_Yc-QRi_RiAHT0IcktmZIrVrHymgTKVPGHMYDQz8pfM5utdE0AglEPxUg0iuvOS3vqiRCrD6BqKvccf5SiokCLrQ36O8kRXC0c3DrV8pIqbwlAz27H8T7ClsnLDsswC9yuCoH30a2/s1600/How+to+add+numbered+comments+inside+blogger.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Add Numbered Comments in Blogger" border="0" height="167" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo493_Yc-QRi_RiAHT0IcktmZIrVrHymgTKVPGHMYDQz8pfM5utdE0AglEPxUg0iuvOS3vqiRCrD6BqKvccf5SiokCLrQ36O8kRXC0c3DrV8pIqbwlAz27H8T7ClsnLDsswC9yuCoH30a2/s400/How+to+add+numbered+comments+inside+blogger.png" title="How to Add Numbered Comments in Blogger" width="400" /></a></div>Another Amazing trick for bloggers that is highly recommended for them.This trick is about How you can add numbered comments count that will show inside a speech bubble in your Blogpost page. With this Trick You or Your readers can easily count how many Total number of Comments were found on Blogger Post page.By Adding the Comments count in your Blogger will help you to improving your Blog value and Importance. <a name="more"></a> <h3>How to Add Numbered Comments on your Blogger</h3>Step 1: Go to your Blogger Dashboard ,then go to your Blogger "Template" and hit on "Edit HTML" button.   <div class="composeBoxWrapper PXLWASD-M-e">Step 2: In Blogger Template HTML ,Press (CTRL+F) for opening the Search Box.</div> Step 3:Then Type this Following Code for searching it inside your Blogger template. Code: <blockquote class="tr_bq"><b:loop values='data:post.comments' var='comment'></blockquote> Step 4:Once you will Find it , Now copy and paste this code just Above it. Code:  <blockquote class="tr_bq"><script type='text/javascript'>var CommentsCounter=0;</script> </blockquote>Step 5: Now again go to the blogger Template Search for this Code. <blockquote class="tr_bq"><data:commentPostedByMsg/></blockquote>Step 6:When you will find this above Code inside your Blogger template , Then paste this Code just right after it. <blockquote class="tr_bq"> <a expr:href='data:comment.url' title='Comment Link'> <script type='text/javascript'> CommentsCounter=CommentsCounter+1; document.write(CommentsCounter) </script> </a> </blockquote>Step 7:Again search for this HTML Tag inside your Blogger template. <blockquote class="tr_bq"></head></blockquote>Step 8: Now just Above this HTML tag "</head>" ,paste this code. <blockquote class="tr_bq"> <style type="text/css"> .comments-number a:link, .comments-number a:visited { color: black !important; text-decoration: none !important; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5hQFRCG21_6Ob2tBP1YiWCtGF0EHyHwIxv5co3Q-fqHWoYzfbSlGGtSt1TyIUGJjnuNO2XyCFBz4I4ArbKbB_CSQdF3u8jO2M9OPwIfEfgsJRbDCEDW3D4_FMFSmJoJvJe2W_VRycQWrZ/s1600/comment+bubble+1.png) no-repeat; width: 50px; /*image-width size*/ height: 48px; /*image-height size*/ float: right; display: block; margin-right: 5px; margin-top: -15px; /*comments-counter position*/ text-align: center; font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif; font-size: 15px; font-weight: normal; } .comments-number a:hover, .comments-number a:active { color: #1BA0E1 !important; text-decoration: none !important; } </style> </blockquote> Step 9:If you want to change the Color of your Comments then replace the Red Highlighted Text with your required color HEX VALUE and paste it their. And if you want to change the Comment Bubble , then simply replace the Blue Highlighted Text link with new comment bubble link.There are a number of comment bubbles that you can easily find on Google. After completing all the Steps , Now Save your blogger Template and Enjoy !!

How to Add Numbered Comments in Blogger

Another Amazing trick for bloggers that is highly recommended for them.This trick is about How you can add numbered comments count that will...

How to Add or Change Favicon in Blogger

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYkABNPOUUtV3uHs7TCO4cMVpne7u3owq05uF2mS2sXO7G3Lh_pMc1gRrPThIMLaDOxRPhWJN3Q0O00dtb1px3ujX9db5qapfvt5UbJbAyulVJ7SsyqV64ugkQ6l2mz4Mji8Jp2ik9jPCa/s1600/add+or+change+favicon+on+blogger.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Add or Change Favicon in Blogger" border="0" height="211" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYkABNPOUUtV3uHs7TCO4cMVpne7u3owq05uF2mS2sXO7G3Lh_pMc1gRrPThIMLaDOxRPhWJN3Q0O00dtb1px3ujX9db5qapfvt5UbJbAyulVJ7SsyqV64ugkQ6l2mz4Mji8Jp2ik9jPCa/s400/add+or+change+favicon+on+blogger.png" title="Add or Change Favicon in Blogger" width="400" /></a></div> Favicon is a very small tiny picture that you have might seen in many sites name in your browser Tab.That small picture that is showing with the blog name is called Favicon. Favicon usually (16px x 16px in size) that is much adjustable size for showing image in the Browser Address bar.When we have created a Blog on Blogger a orange colored Blogger is automatically shown as Favicon for our new Blog. <a name="more"></a> You can also customize your Blogger Favicon by adding a new image that you want to show as Favicon in  your blog, whenever someone will visits your blog , He will take a look at your Blogger favicon and a Good Favicon image also a good way to get attention of the visitors. Adding a new Favicon image on the Blogger is not difficult , but mostly blogger are not aware of this feature to customize and designing their Blog for giving them a new look which is more suitable for their Blog nature and also a Good practice for Getting Visitors positive impressions. <h3>How To Add a Favicon to Your Blogger Blog </h3> Step 1: Log in to your Blogger and then open your Blog . From the Dashboard ,Click on "Layout". Step 2: There you will see option of "Favicon" on right above at your Layout settings.Click on "Edit" to add a new favicon for your Blogspot blog. <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhh1mh4I3CC2MX_QtgMlMDDa42ArXQihvsAXq-D6y2SH8DlQ7A7HUOaAPBE1Jc3LmxOAN_xWDE3O-eFnex49k5pW9h5mZnJSZB-WMC5GLs44L6ow29c-3mn1wk64Bj113D64K4vLiPmOOK4/s1600/change+blogger+favicon.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt=" Add or Change new Favicon on Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhh1mh4I3CC2MX_QtgMlMDDa42ArXQihvsAXq-D6y2SH8DlQ7A7HUOaAPBE1Jc3LmxOAN_xWDE3O-eFnex49k5pW9h5mZnJSZB-WMC5GLs44L6ow29c-3mn1wk64Bj113D64K4vLiPmOOK4/s1600/change+blogger+favicon.png" title=" Add or Change new Favicon on Blogger" /></a></div> Step 3:Once you click on "Edit" option of Favicon , a new window will appear on your computer Screen.There you can see option of "Browse" which means that upload your image that you want to use as your Blogger favicon.For Adding your new Favicon Click on Browse option and Select that image that you want to upload for using it as your Blog Favicon. <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi20wX51OHV1rdtIIgk2TlWfBXBBvM3amQgAz6DL3G8jg2e6VvIVEfzDG82M8Nme0o61WUzlKbC5yWrHyuvt6ObzfteB0p3Rzx3N5_eCaospY4W13DEJa7axpzLrMIcMK5BrpTx5j5SSJHg/s1600/add+favicon+on+blogger.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Add or Change Favicon on Blogger" border="0" height="192" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi20wX51OHV1rdtIIgk2TlWfBXBBvM3amQgAz6DL3G8jg2e6VvIVEfzDG82M8Nme0o61WUzlKbC5yWrHyuvt6ObzfteB0p3Rzx3N5_eCaospY4W13DEJa7axpzLrMIcMK5BrpTx5j5SSJHg/s400/add+favicon+on+blogger.png" title="Add or Change Favicon on Blogger" width="400" /></a></div> Step 4:Now you have DONE!! , open your Blog there you will see your new Favicon instead of Blogger default Favicon. In the above Steps you have learnt how to add or change favicon on your Blogger . That was simple Favicon with Image that you will use. But if you want to Add animated Favion into your Blogger then follow up this Guide. <h3>How to Add an Animated Favicon in Blogger</h3>Step 1:First Log in to your Blogger account then go to "Template" > "Edit HTML". Step 2:Now in the blogger template , Search for this HTML TAG. <blockquote class="tr_bq"><b:skin> </blockquote> Step 3:Once you find this TAG inside your blogger template , paste this Code just above it. <blockquote class="tr_bq"><link href="Paste-favicon-links-here" rel="icon" type="image/gif"/></blockquote>  Step 4:Replace the Paste-favicon-links-here with your Animated favicon Link that you want to use in your Blogspot blog. After Doing all the steps Now save your Template and You have Done !!

How to Add or Change Favicon in Blogger

Favicon is a very small tiny picture that you have might seen in many sites name in your browser Tab.That small picture that is showing with...

How to Add Different Backgrounds In Blogger Posts/Pages

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjROaGQguTzXXIcK24m9ng84il2yYl4OAwNQh6Czt1lKNG_iBdJOWchY-FmHowmLmWPX7knrIljHXf6bqwAbDua9qx5Ng7VPPqjI8ne2rdH2l6ZxW__s-1Nfb2jX4FAP64dzBrhGmsMV5JI/s1600/how+to+Add+Different+Backgrounds+In+Blogger+Pages.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Add Different Backgrounds In Blogger Posts/Pages" border="0" height="151" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjROaGQguTzXXIcK24m9ng84il2yYl4OAwNQh6Czt1lKNG_iBdJOWchY-FmHowmLmWPX7knrIljHXf6bqwAbDua9qx5Ng7VPPqjI8ne2rdH2l6ZxW__s-1Nfb2jX4FAP64dzBrhGmsMV5JI/s400/how+to+Add+Different+Backgrounds+In+Blogger+Pages.png" title="Add Different Backgrounds In Blogger Posts/Pages" width="400" /></a></div> Customizing and Make your Blogger Look attractive is a best way to get users return to your blog.Making your blog Pages with Different backgrounds gives positive impression to your visitors . By specifying Each blog Page with a new Background will help your visitors that comes to your Blog in understanding easily content and your will blog will looks differ rather then those blog which have only one background for their each Page in their Blogger. <a name="more"></a> So in this tutorial i will tell you How can easily change or Add Different Backgrounds in your Blogger pages.To apply Different Backgrounds for each pages you have to apply some changes in your Blogger template , and then your each Blog Pages will have their unique designed Background. <h2>How to Apply a Different Background in Blogger Posts/Pages ?</h2>Step 1:Log into Your Blogger account and then open your That Blog there you want to Apply a Different Background for each Posts/Pages. Step 2: After opening your Desired Blog , Now Go "Template" and then click on "Edit HTML" button. Step 3:Once you have opened your Blog Template HTML , Now Press "CTRL+F" to open the Search Box and Find out the This HTML TAG inside your Blogger template. HTML TAG: <blockquote class="tr_bq"> </head></blockquote> As you can see in the below screenshot. <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLKafsZl70Kcj8_5diHmLJD6SLJWfo1eM-fPdj2ndrcH3bY77dDzEyyjQVWKmOXVdcd_tGOMHbleOMsqD-I_Lt_WZn6RJS6smG7UPdCVQxcD4qslTJ0CSTQKGTHQ1IvZ01jpYVjb1BS3po/s1600/Add+Different+Backgrounds+In+Blogger+Pages.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt=" Add Different Backgrounds In Blogger Pages" border="0" height="315" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLKafsZl70Kcj8_5diHmLJD6SLJWfo1eM-fPdj2ndrcH3bY77dDzEyyjQVWKmOXVdcd_tGOMHbleOMsqD-I_Lt_WZn6RJS6smG7UPdCVQxcD4qslTJ0CSTQKGTHQ1IvZ01jpYVjb1BS3po/s640/Add+Different+Backgrounds+In+Blogger+Pages.png" title=" Add Different Backgrounds In Blogger Pages" width="640" /></a></div> Step 4:Now just paste this below CSS code right above the HTML Tag "</head> ". CSS Style Code: <blockquote class="tr_bq"><b:if cond='data:blog.url == &quot;http://my-blog.com/my-name.html&quot;'> <style> body {     background-image: url(http://LINK_OF_BACKGROUND_IMAGE.com/IMAGE.JPG);     background-position: center;     background-repeat: repeat;     background-attachment: fixed; } </style> </b:if></blockquote><h3>Custom Background in a Specific Page:</h3>In the above CSS code , replace the http://my-blog.com/my-name.html with your required Blog Post/Page Link that which you want to apply the changes of custom Background.Go to your Blog and Copy and replace that link of Page in the CSS code with Red Highlighted URL . Now replace http://LINK_OF_BACKGROUND_IMAGE.com/IMAGE.JPG the Blue Highlighted URL with your that Image Direct Link that you want to use as Background in your Blog Post/Page. Step 5:After Adding your Page URL Address and Your Background Image Direct Link , click on "Save Template" for saving the Background Settings. Now You have DONE!! Just visit you Page and see background image has been changed Successfully.For Applying the background on another Page follow the above steps Again.